import { ThemeConfig } from '@/configs/theme';
import { SESSION_THEME_INFO } from '@/constants';
import { IThemeActionProps } from '@/types/ThemeTypes';
import { ucfirst } from '@/utils/StringUtil';
import { getThemeConfig } from '@/utils/ThemeUtil';
import { createSlice } from '@reduxjs/toolkit';

//该store分库的初始值
const initialState = getThemeConfig();

const reducers: any = {};
Object.keys(ThemeConfig.initTheme).map((item) => {
  reducers[`set${ucfirst(item)}`] = (state: any, action: any) => {
    // 修改了store分库里colorPrimary的值（用于让全项目动态生效）
    state[`${item}`] = action.payload;
    // 更新localStorage的主题配置（用于长久保存主题配置）
    window.localStorage.setItem(SESSION_THEME_INFO, JSON.stringify(state));
  };
});

export const themeSlice: any = createSlice({
  // store分库名称
  name: 'theme',
  // store分库初始值
  initialState,
  reducers,
});

// 将setDark和setColorPrimary方法抛出
export const { setDark, setColorPrimary } = themeSlice.actions;
console.log(themeSlice.actions);
export const themeReducer: IThemeActionProps = themeSlice.actions;

export default themeSlice.reducer;
